<template>
  <ul class="list-group">
    <router-link tag="li" :to="{name: 'topic', params: {id: topic.id}}" class="list-group-item" v-for="(topic, index) in topics" :key="index">{{topic.title}}</router-link>
  </ul>
</template>

<script>
export default {
  data () {
    return {
      topics: []
    }
  },
  watch: {
    '$route': {
      handler (to) {
        console.log(to.params.tab)
        const tab = to.params.tab
        // 根据tab请求数据
        this.axios.get('https://cnodejs.org/api/v1/topics', {
          params: {
            limit: 10,
            // tab: tab
            tab
          }
        }).then(res => {
          this.topics = res.data.data
        })
      },
      immediate: true
    }
  }
}
</script>

<style>

</style>
